<<<<<<< HEAD
<template>
	<view>
		<u-tabs-swiper ref="uTabs" :list="tabs" :current="current" :is-scroll="false" @change="tabsChange"></u-tabs-swiper>
		<swiper :style="{height: height}" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
			<swiper-item class="swiper-item" v-for="(item, index) in tabs" :key="index">
				<mescroll-item ref="mescrollItem" :i="i" :index="swiperCurrent" :tabs="tabs" :height="height" :status="item.status"></mescroll-item>
			</swiper-item>
		</swiper>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import MescrollItem from "./extOrder-item.vue";
	export default {
=======
<template>
	<!-- <view>
		<u-tabs-swiper ref="uTabs" :list="tabs" :current="current" :is-scroll="false" @change="tabsChange"></u-tabs-swiper>
		<swiper :style="{height: height}" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
			<swiper-item class="swiper-item" v-for="(item, index) in tabs" :key="index">
				<mescroll-item ref="mescrollItem" :i="i" :index="swiperCurrent" :tabs="tabs" :height="height" :status="item.status"></mescroll-item>
			</swiper-item>
		</swiper>
		<u-toast ref="uToast" />
	</view> -->
</template>

<script>
	import MescrollItem from "./extOrder-item.vue";
	export default {
>>>>>>> pingtuan
		components: {
			MescrollItem
		},
		data() {
			return {
				height: '',
				tabs: [{
					name: '全部',
					status: 0,
				}, {
					name: '在路上',
					status: 1,
				}, {
					name: '已结算',
					status: 2,
				}, {
					name: '无佣金',
					status: 3,
				}],
				current: 0, // tabs组件的current值，表示当前活动的tab选项
				swiperCurrent: 0, // swiper组件的current值，表示当前那个swiper-item是活动的
			}
		},
		onLoad({current}) {
			this.height = (uni.getSystemInfoSync().windowHeight - uni.upx2px(80)) * 2 + 'rpx'
			this.current = current
			this.swiperCurrent = current
		},
		methods: {
			// tabs通知swiper切换
			tabsChange(index) {
				this.swiperCurrent = index;
			},
			// swiper-item左右移动，通知tabs的滑块跟随移动
			transition(e) {
				let dx = e.detail.dx;
				// this.$refs.uTabs.setDx(dx);
			},
			// 由于swiper的内部机制问题，快速切换swiper不会触发dx的连续变化，需要在结束时重置状态
			// swiper滑动结束，分别设置tabs和swiper的状态
			animationfinish(e) {
				let current = e.detail.current;
				this.$refs.uTabs.setFinishCurrent(current);
				this.swiperCurrent = current;
				this.current = current;
			}
		}
	}
</script>

<style>
	body {
		background-color: #f5f5f5;
	}
</style>
